import Vue from 'vue'
import VueRouter from 'vue-router'

// 是否碰到过 vue-router 多次点击控制台报错的问题
// 原因
// vue router ≥ v3.1 后 ，回调形式改成 promise api 了，返回的是 promise，如果没有捕获到错误，控制台始终会出现如上图的警告 
// 解决方案 ：改变this指向 统一去增加catch捕获错误
const originalPush = VueRouter.prototype.push
VueRouter.prototype.push = function push(location) {
  return originalPush.call(this, location).catch(err => err)
}


Vue.use(VueRouter)

const routes = [
  {
    path:"/",
    redirect:"/login" //重定向到login页
  },
  { //登录
    path:"/login",
    name:"login",
    component:()=>import("../views/Login/index.vue")
  },
  { //管理系统的架构页
     path:"/layout",
      name:"layout",
      meta:{
        title:"一级路由"
      },
    component:()=>import("../views/Layout/index.vue"),
    children:[
      {path:'/',name:"home",component:()=>import("../views/Home/index.vue"),
      }, //首页
       {path:'admin',name:"admin",component:()=>import("../views/Admin/index.vue"),meta:{title:"管理员"}}, //管理员模块
       { //视频管理模块
        path:"videolist",name:'videolist',
        component:()=>import("../views/Video/index.vue"),
        meta:{title:"视频列表"}
       },
       { //学员管理模块
        path:"student",
        name:"student",
        component:()=>import("../views/Student/index.vue"),
        meta:{title:"学员列表"}
       },
       { //课程添加模块
        path:"courseAdd",
        name:"courseAdd",
        component:()=>import("../views/courseAdd/index.vue"),
         meta:{title:"课程添加"}
       },
       { //课程列表页
        path:"courseList",
        name:"courseList",
        component:()=>import("../views/CourseList/index.vue"),
       meta:{title:"课程列表"}
        
       }
    ]
  },
   { //网格布局
        path:"/grid",name:'grid',
        component:()=>import("../views/Grid/index.vue")
    }
]

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL, //获取当前服务路径localhost:8080
  routes
})

export default router
